<template>
	<view class="content" >
		<!-- nav栏 -->
		<!-- <navBar></navBar> -->
		<scroll-view scroll-x="true" show-scrollbar='false' class="nav-box">

			<view @click="navClick(itme.id)" v-for="(itme,index) in navArr" :key="itme.id" 
			:class="itme.id === Navindex ? 'active' :''"
			class="nav-itme">{{itme.league}}</view>
		
		</scroll-view>
		
		<!-- 热门滑块 -->
		<scroll-view  class="uni-cards" enable-flex='true' scroll-x="true" show-scrollbar='false'>
			<!-- 图文卡片模式 -->
	
				<item  v-for="itme in showData" :key="itme" class="itme">	
					<image @click="xinwenClick(itme)" style="width: 100%;" mode="aspectFill" :src="itme.image"></image>
					<text class="title">{{itme.title}}</text>
				</item>
				<!-- #ifdef H5 -->
				<item class="itme">
					<image @click="xinwenClickH5(1)" style="width: 100%;" mode="aspectFill" src="https://p5.img.cctvpic.com/photoworkspace/2022/12/12/2022121212524283265.jpg"></image>
					<text class="title">[世界杯新闻]中国裁判组告别世界杯</text>
					
				</item>
				<item class="itme">
					<image @click="xinwenClickH5(2)" style="width: 100%;" mode="aspectFill" src="https://p5.img.cctvpic.com/photoworkspace/2022/12/12/2022121215352393319.jpg"></image>
					<text class="title">半决赛：梅西再战老对手 卫冕冠军对阵最大“黑马”</text>
				</item>
				<item class="itme">
					<image @click="xinwenClickH5(3)" style="width: 100%;" mode="aspectFill" src="https://p2.img.cctvpic.com/photoworkspace/2022/12/12/2022121215150569681.jpg"></image>
					<text class="title">克罗地亚球员：对梅西没特别计划 主帅：他不太跑动</text>
				</item>
				
				<item class="itme">
					<image @click="xinwenClickH5(4)" style="width: 100%;" mode="aspectFill" src="https://p1.img.cctvpic.com/photoworkspace/2022/12/12/2022121212015648050.jpg"></image>
					<text class="title">阿根廷队拍摄半决赛用球宣传照 梅西的胡子刮掉了</text>
				</item>
				<!-- #endif -->
							
		</scroll-view> 
		
		 <!-- NBA盒子 -->
		<view class="football">
			<view class="title">
				 <image class="nba-logo-img" src="@/static/images/nbalogo.png" style="width:80rpx;height: 80rpx;" mode="aspectFit"></image>
				 <text class="title-itme"> NBA</text> 
				<text @click='navClick(4314)' class="more">更多 <uni-icons class='icon' customPrefix="iconfont" type='icon-arrow-right' size="24px"></uni-icons></text>
			</view>
			<!-- NBA滑块 -->
			<scroll-view class="uni-card"  enable-flex='true' scroll-x="true" show-scrollbar='false'>
				<!-- 图文卡片模式 -->
					<view @click="nbaItmeClick(itme.id)" v-for="itme in nbaDataArr.slice(15,-15)" :key="itme.id" class="football-itme">
						<!-- <text>{{itme.startTime}}</text> -->
						<view class="logo" >
							<image  class="football-img" :src="itme.homePicUrl" mode="aspectFill"></image>
							<image class="football-img" :src="itme.guestPicUrl" mode="aspectFill"></image>
						<!-- <image  class="football-img" src="../../static/images/football1.png" mode="aspectFill"></image>	
						<image class="football-img" src="../../static/images/football2.png" mode="aspectFill"></image> -->	
						</view>
						
						<view class="team-score" >
							<view class="team-name">{{itme.homeName}}<text class="number">{{itme.homeScore}}</text> </view>
							<view class="team-name">{{itme.guestName}}<text class="number">{{itme.guestScore}}</text> </view>
						</view>
						
						<view class="startTime">{{itme.startTime.substring(0,10)}}</view>
						<view v-if="itme.statusDesc === '已结束'" class="statusDesc">{{itme.statusDesc}}</view> <view v-else class="statusDesc active">未开始</view>
					</view>
					  
			</scroll-view>			
		</view>
		
		<!-- 世界杯盒子 -->	
		<view class="nba-box">
			<view class="nba-title"> 
			<uni-icons class="nba-logo-img" color="red" size='60rpx' type="fire-filled"></uni-icons>
			<text class="title-itme">2022世界杯</text>  
			<text @click='navClick(3400)' class="more">更多 
			<uni-icons class='icon' customPrefix="iconfont" type='icon-arrow-right' size="24px"></uni-icons></text>
			</view>
			<scroll-view class="scroll-nba" scroll-x="true" show-scrollbar='false' >
				<view @click="fifaItmeClick(itme.id)" class="scroll-itme" v-for="itme in fifaDataArr" :key="itme.id">
					
					<view class="nba-logo">
					<image  class="nba-img" :src="itme.homePicUrl" mode="aspectFill"></image>
						<text class="number">{{itme.homeScore || 0 }} : {{itme.guestScore || 0 }}</text>
					<image class="nba-img" :src="itme.guestPicUrl" mode="aspectFill"></image>						
					</view>
					
					<view class="nba-team">
						<text class="nba-team-name-left">{{itme.homeName}}</text>
						<text class="nba-team-name-right">{{itme.guestName}}</text>
					</view>
					<view class="roundType">{{itme.roundType}}</view>
					<view class="startTime">{{itme.startTime}}</view>					
				</view>
	
			</scroll-view>
		</view>

		<!-- CBA盒子 -->
		<view class="cba-box">
			
			<view class="cba-title">
				<image class="cba-title-img" src="@/static/images/cbalogo.png" style="width:70rpx;height: 70rpx;" mode="aspectFit"></image>
				<text class="cba-title-text">CBA</text>
				<text @click='navClick(4315)' class="more">更多 <uni-icons class='icon' customPrefix="iconfont" type='icon-arrow-right' size="24px"></uni-icons></text>
			</view>
			<view class="cba-content">
				<view @click="cbaItmeClick(itme.id)" class="cba-itme" v-for="itme in cbaDataArr.slice(-15,)" :key="itme.id">
					<view class="cba-logo">
						<image class="cba-logo-img"  mode="aspectFill" :src="itme.homePicUrl"></image>
						<image class="cba-logo-img"  mode="aspectFill" :src="itme.guestPicUrl"></image>
					</view>
					<view class="cba-team-score">
						<view class="cba-team-name">{{itme.homeName}} VS {{itme.guestName}}</view>
						<view class="cba-team-name"><text class="left">{{itme.homeScore}}</text>   -    <text class="right">{{itme.guestScore}}</text> </view>
					</view>
					<view v-if="itme.statusDesc === '已完赛'" class="check end">查看</view> <view v-else class="check">未开始</view>
					<!-- <view class="check">查看</view> -->
				</view>
	
			</view>
		</view>
	</view>
</template>

<script>
	import dayjs from 'dayjs'
	import store from '@/store/index.js'
	import {mapState,mapMutations} from 'vuex'//引入mapState
	export default {
		data() {
			return {
				//导航栏数据
				navArr:[],
				//总的数据
				fifaxinwenArr:[],
				//每页显示的数据
				showData:[],
				//世界杯第一层数据
				fifaArr:[],
				//世界杯第二次数据
				fifaDataArr:[],
				//NBA赛程第一层数据
				nbaArr:[],
				//NBA赛程第二层数据
				nbaDataArr:[],
				//CBA赛程第一层数据
				cbaArr:[],
				//CBA赛程第二层数据
				cbaDataArr:[],
				Navindex:0
			}
		},
		onShow() {
			this.Navindex = 0
			console.log(this.Navindex,"index--onShow----");
		},
		onLoad() {
          console.log("onload---------");
		  //页面加载时把默认的Navindex存到本地，目的为了不点nav直接点击赛程tabbar选项
		
			this.getRemenData()
			this.getNavData()
			this.getFIFAData()
			this.getNBAData()
			this.getCBAData()
			//开启下拉刷新，调用后触发下拉刷新动画
			uni.startPullDownRefresh();
		},
		//下拉刷新处理函数
		onPullDownRefresh() {
				
				setTimeout(() =>{	
					//停止当前页面下拉刷新。
					uni.stopPullDownRefresh();
					console.log("stopPullDownRefresh");
				}, 1000);
			},
		methods: {
			//导航栏数据
			getNavData(){
				uni.request({
					url: 'https://cbs-i.sports.cctv.com/cache/0fe461738f548ffb6227a83776895fad?ran=1668852906652',
					//https://cbs-i.sports.cctv.com/cache/ef972bd6675867a16c8fd5c0b4597a56?ran=1668853113695
					method: 'GET',
					data: {},
					success: res => { 				
						//过滤数组
						 let arr = res.data.results.filter((value)=>{
							return value.id === 0 || value.id === 3238 || value.id === 3325 || value.id === 3246 || value.id === 3239 || value.id === 3400 || value.id === 4314 || value.id === 4315
						});
						//将过滤好的数组按照自己想要的顺序排列
						arr.sort((a,b)=>{
							let sortArr = ['热门','世界杯','NBA','CBA','英超','中超','欧冠','意甲']
							return sortArr.indexOf(a.league) - sortArr.indexOf(b.league)
						})
						//赋值
						this.navArr = arr		
					},
					fail: () => {},
					complete: () => {}
				});
	
			},
			//导航栏点击事件
			navClick(id){
				this.Navindex = id;
				if(id !== 0){
					try{
						uni.setStorageSync('navIndexKey',id)
					} catch(error){
						console.log(error);
					}
					uni.switchTab({
						url: '/pages/schedule/schedule',
						success: res => {
							console.log(id,'navigateTo-------------');
						},
						fail: () => {},
						complete: () => {}
					});
				}
				console.log(id,'nav-------------');
			},
			//NBA点击事件
			nbaItmeClick(id){
				uni.navigateTo({
					url:`/pages/game-detail/game-detail?id=${id}`
				})
				console.log('NBAclick-------',id);	
			},
			//世界杯点击事件
			fifaItmeClick(id){
				uni.navigateTo({
					url:`/pages/game-detail/game-detail?id=${id}`
				})
				console.log('FIFAclick-------',id);	
			},
			//CBA点击事件
			cbaItmeClick(id){
				uni.navigateTo({
					url:`/pages/game-detail/game-detail?id=${id}`
				})
				console.log('FIFAclick-------',id);	
			},
			//热门新闻点击事件-H5条件编译
			xinwenClickH5(itme){
				// #ifdef H5
				if(itme === 1){
					
					let image = "https://p5.img.cctvpic.com/photoworkspace/2022/12/12/2022121212524283265.jpg"
					let image2 = "https://p3.img.cctvpic.com/fmspic/2022/12/12/d206cf4ec5eb4514b10324487fd329fe-40872291-0.jpg"
					let image3 = "https://p2.img.cctvpic.com/fmspic/2022/12/12/d206cf4ec5eb4514b10324487fd329fe-40872291-2.jpg"
					let brief = "卡塔尔世界杯已经有越来越多的球队离开，同样告别赛场的还有一些裁判员。中国裁判组已经离开卡塔尔，返回国内。"
					uni.navigateTo({
						url:`/pages/news-details/news-details?image=${image}&image2=${image2}&image3=${image3}&brief=${brief}`,
					})
				}
				if(itme === 2){
					let image = "https://p5.img.cctvpic.com/photoworkspace/2022/12/12/2022121215352393319.jpg"
					let image2 = ""
					let image3 = ""
					let brief = "新华社多哈12月12日电（记者董意行）13日，卡塔尔世界杯半决赛即将拉开战幕。梅西将带领阿根廷队"
					uni.navigateTo({
						url:`/pages/news-details/news-details?image=${image}&image2=${image2}&image3=${image3}&brief=${brief}`,
					})
				}
				if(itme === 3){
					let image = "https://p2.img.cctvpic.com/photoworkspace/2022/12/12/2022121215150569681.jpg"
					let image2 = ""
					let image3 = ""
					let brief = "央视网消息：世界杯半决赛，克罗地亚将对阵阿根廷，克罗地亚球员佩特科维奇表示，他们没有针对梅西的特别计划。佩特科维奇在赛前的新闻发布会上表示：“我们没有一个特别的计划来阻止梅西。与其只关注一名球员，不如去想着如何阻止整个阿根廷队。阿根廷有很多优秀的球员，很难只专注于一个。”而克罗地亚主教练达利奇也表示，不会对梅西进行人盯人的防守。达利奇指出，对梅西一对一盯防没什么用，克罗地亚不会这么做，他们能做的是挤压梅西的空间，封锁他传球的线路。　　达利奇表示，梅西不怎么跑动，也不怎么去追赶皮球，他很多时候都是在等待，但拿到了球就变成了另一个梅西，需要对他进行特别的防范。"
					uni.navigateTo({
						url:`/pages/news-details/news-details?image=${image}&image2=${image2}&image3=${image3}&brief=${brief}`,
					})
				}
				if(itme === 4){
					let image = "https://p1.img.cctvpic.com/photoworkspace/2022/12/12/2022121212015648050.jpg"
					let image2 = ""
					let image3 = ""
					let brief = "央视网消息：当地时间12月11日，阿根廷官方发布了为世界杯半决赛用球拍摄的宣传照，梅西、迪马利亚、马丁内斯和阿尔瓦雷斯参与了拍摄。世界杯半决赛和决赛中的用球名为：Al Hilm，在阿拉伯语中的意思为梦想。"
					uni.navigateTo({
						url:`/pages/news-details/news-details?image=${image}&image2=${image2}&image3=${image3}&brief=${brief}`,
					})
				}
				// #endif
			},		
			//热门新闻点击事件
			xinwenClick(itme){
				let image = itme.image
				let image2 = itme.image2
				let image3 = itme.image3
				let brief = itme.brief
				uni.navigateTo({
					url:`/pages/news-details/news-details?image=${image}&image2=${image2}&image3=${image3}&brief=${brief}`,
				})
			},
			//获取热门新闻数据
			getRemenData(){
				uni.request({
					url: 'https://sports.cctv.com/2019/07/gaiban/cmsdatainterface/page/guoji_shijiebei_1.jsonp?cb=guoji_shijiebei',
					method:'GET',
					/* header:{	
						'Cookie': 'cna=Pcv8G21OfGcCAbSM9+EO7e9K; sca=6c60fbfa; cbsVisitorId=user_9da84ad1cab70b8cc2c703a05ad; country_code=CN; atpsida=86c814a4aa73b589c9d62d3c_1670492261_2',			
						'content-type': 'application/json',
						'Referer': 'https://sports.cctv.com',
						'X-Requested-With': 'XMLHttpRequest',
					}, */
					success: (res) => {
						
						let jsonData = res.data
						let obj = jsonData.slice(16,-1)
						let obj2 = JSON.parse(obj)
						
						for( let i = 0; i < obj2.data.list.length;i++){
							this.fifaxinwenArr.push(obj2.data.list[i])
						}
						this.showData = this.fifaxinwenArr.slice(0,8)	
						// 以载荷形式分发
						store.dispatch('getRemenData', this.fifaxinwenArr)
					}
				})
			},
			//获取世界杯数据
			getFIFAData(){
				let startTime = dayjs(dayjs().subtract(3, 'day')).format('YYYY-MM-DD')
				let endTime = dayjs(dayjs().add(4, 'day')).format('YYYY-MM-DD')
				uni.request({
					url: `https://cbs-u.sports.cctv.com/pc/game/date_game_list?client=pc&startTime=${startTime}&endTime=${endTime}&leagueId=3400&ran=${Date.now()}`,
					method: 'GET',
					data: {},
					success: res => {
									
						this.fifaArr=res.data.results
						
						for(let i = 0;i < this.fifaArr.length;i++){
							
							this.fifaDataArr.push(...this.fifaArr[i].list)
						}
						  
					},
					fail: () => {},
					complete: () => {}
				});	
			},		
			//获取NBA赛程数据
			getNBAData(){
					let startTime = dayjs(dayjs().subtract(3, 'day')).format('YYYY-MM-DD')
					let endTime = dayjs(dayjs().add(4, 'day')).format('YYYY-MM-DD')	
				
					uni.request({
						url: `https://cbs-u.sports.cctv.com/pc/game/date_game_list?client=pc&startTime=${startTime}&endTime=${endTime}&leagueId=4314&ran=${Date.now()}`,
						method: 'GET',
						data: {},
						success: res => {
									
							this.nbaArr=res.data.results
							
							for(let i = 0;i < this.nbaArr.length;i++){
								
								this.nbaDataArr.push(...this.nbaArr[i].list)
							}	
						},
						fail: () => {},
						complete: () => {}
					});	
				},				
			//CBA获取数据
			getCBAData(){
					let startTime = dayjs(dayjs().subtract(3, 'day')).format('YYYY-MM-DD')
					let endTime = dayjs(dayjs().add(4, 'day')).format('YYYY-MM-DD')
					uni.request({
						url: `https://cbs-i.sports.cctv.com/cache/fd0a851b5a300d7a3f6a00b1b53b835c?ran=${Date.now()}`,
						method: 'GET',
						data: {},
						success: res => {
									
							this.cbaArr=res.data.results
							
							for(let i = 0;i < this.cbaArr.length;i++){
								
								this.cbaDataArr.push(...this.cbaArr[i].list)
							}					  
						},
						fail: () => {},
						complete: () => {}
					});		
				},
			addCount() {
				store.commit('add', 5)//每次累加 5
				//对象展开运算符直接拿到add
				},
			/* ...mapMutations(['add'])//对象展开运算符直接拿到add */	
		},  
		computed: {
					//使用对象展开运算符将此对象混入到外部对象中
					...mapState({
						username: state => state.username,
						age: state => state.age,
						count:state => state.count,		
					})
			},
	}
</script>

<style lang="scss" scoped>
	/* Home */
	.content {

		//height: 1764px;
		background: linear-gradient(150deg, #000000 28%, #ffffff 0%);
		//background: #ffffff;
        /* ::-webkit-scrollbar {
         display: none;
         width : 0 !important;
		 height: 0 !important;
		 -webkit-appearance: none;
		 background: transparent;
		 color: transparent;
         }
			*/
		/* card */
		.uni-cards {
			white-space: nowrap;
			/* margin-top: 10px;	 */	
			padding-top: 28px;
			width: 100%;			
			border-radius: 16px;        
			/* ::-webkit-scrollbar {
				width: 0px;
				height: 0px;
			} */
			
				.itme {
					display: inline-block;
					background-color: #ffffff;
					border-radius: 16px;
					overflow: hidden;
										
					width: 400rpx;
					height: 615rpx;			
					margin: 40rpx 20rpx;			
					box-shadow:  6px 10px 10px rgba(208, 204, 203, 0.5);
				
						.title {
							display: block;				
							padding-left: 10px;
							padding-top: 20rpx;
							/* display: -webkit-box; */
							/* word-break: break-all;
							-webkit-line-clamp: 2;
							-webkit-box-orient: vertical; */
							white-space: nowrap;
							overflow: hidden;
							text-overflow: ellipsis;
							line-height: 50rpx;
							
						}
					
				}
		}

		/* nav */
		.nav-box {
			position: fixed;
			top: var(--window-top);
			white-space: nowrap;
			height: 30px;
			line-height: 30px;
			z-index: 9;
			padding-bottom: 10px;
			background-color: #000000;

			/* ::-webkit-scrollbar {
				width: 0px;
				height: 0px;
			} */

			.nav-list {
				display: flex;
				justify-content: space-between;
				color: #fff;

			}

			.nav-itme {
				display: inline-block;
				font-size: 36rpx;
				color: #fff;
				padding: 5rpx 35rpx;

				//margin: 5rpx 50rpx 0rpx 18rpx;
				&.active {
					color: #935559;
				}
			}
		}
	
		/* NBA */
		.football{
			width: 100%;
			height: 526rpx;
			
			background-color: #E0E0E0;
			border-radius: 36px 0px 0px 33px;
			white-space: normal;
			
			.title{
				display: flex;
				justify-content: space-between;
				align-items: center;
				font-size: 36rpx;
				height: 28px;
				line-height: 28px;
				padding-top: 10px;
				
				.nba-logo-img{
					margin-left: 30rpx;
				}	
				.title-itme{
					margin-right: 430rpx;
					font-size: 40rpx;
					
				}
				.more{
					display: inline-block;
					position: relative;
					margin-right: 40rpx;
					.icon{
						position: absolute;
						right: -20px;
						
						
					}
				}
			}
			.uni-card{
				width: 100%;
				white-space: nowrap;
				/* ::-webkit-scrollbar {
					width: 0px;
					height: 0px;
				} */
				.football-itme{
					position: relative;
					display: inline-block;
					width: 260rpx;
					height: 390rpx;
					border-radius: 16px;
					//background: #2648D1 ;
					background: linear-gradient(150deg, rgba(13,0,0,0.00) -5%, #036bd2 100%);
					margin: 10px 10px 16px 20px;
				.logo{
					/* display: flex;
					justify-content:space-around;
					align-items: center; */
					position: absolute;
					top: 20%;
					left: 50%;
					transform: translate(-50%,-50%);
				
					.football-img{
						
						width:105rpx ;
						height: 105rpx; 
						margin: 0 10px;
					}
				}	
				
				.team-score{
					position: absolute;
					color: #fff;
					bottom: 120rpx;
					left: 16rpx;
					.team-name{
						display: flex;
						justify-content: space-between;
						align-items: center;
						margin: 10px 0;
						.number{
							position: absolute;
							left: 180rpx;
						}
					}
				}
				.startTime{
					position: absolute;
					color: #fff;
					text-align: center;
					left: 50%;
					top: 70%;
					transform: translate(-50%,0%);
				}
				.statusDesc{
					position: absolute;
					color: #c9c2c2;
					text-align: center;
					left: 50%;
					top: 85%;
					transform: translate(-50%,0%);
					&.active{
						color: #c92e0f;
					}
				}
					
			}
		}	
			
		}
	
		/* 足球 */
		.nba-box{
			margin: 20px 0px;
			
			.nba-title{
				display: flex;
				justify-content: space-between;
				align-items: center;
				font-size: 36rpx;
				height: 28px;
				line-height: 28px;
				padding-top: 10px;
				
				.nba-logo-img{
					margin-left: 30rpx;
				}	
				.title-itme{
					margin-right: 310rpx;
					font-size: 40rpx;
					
				}
				.more{
					display: inline-block;
					position: relative;
					margin-right: 40rpx;
					.icon{
						position: absolute;
						right: -20px;
						
						
					}
				}
			}	
				
			.scroll-nba{
				white-space: nowrap;
				::-webkit-scrollbar {
					width: 0px;
					height: 0px;
				}
				.scroll-itme{
					/* position: relative; */
					display: inline-block;
					width: 606rpx;
					height: 392rpx;
					border-radius: 16px;
					margin: 10px 10px;
					background: linear-gradient(180deg, rgba(13,0,0,0.00) -3%, #420202 100%);
					box-sizing: border-box;
					border: 1px solid #4E4E4E;
					
					.nba-logo{
						display: flex;
						justify-content: space-around;
						align-items: center;
						padding-top: 30%;
						transform: translate(0,-50%);
						
						.nba-img{
							width: 140rpx;
							height: 140rpx;
							
						}
						.number{
							color: #fff;
							font-size: 50rpx;
							
						}		
					}
					
					.nba-team{
						/* display: flex;
						justify-content: space-around;
						align-items: center;
						display: inline-block; */
						position: relative;
						color: #fff;
						font-size: 38rpx;
						
						.nba-team-name-left{
							position: absolute;
							left:30px ;
							bottom: 60px;
							
						}
						.nba-team-name-right{
							position: absolute;							
							right: 30px;
							bottom: 60px;
						}
					}
				
					.roundType{
						position: relative;
						color: #fff;
						font-size: 42rpx;
						text-align: center;
						bottom: 60rpx;
						/* margin-left:50%; */
						
						
					}
					.startTime{
						position: relative;
						color: #fff;
						font-size: 38rpx;
						text-align: center;
						bottom: 30rpx;
						
					}
					
				}
			}
			
		}
		
		/* CBA */
		.cba-box{
			
			.cba-title{
				display: flex;
				justify-content: space-between;
				align-items: center;
				font-size: 36rpx;
				height: 60rpx;
				line-height: 60rpx;
				padding-top: 20rpx;
				
				.cba-title-img{
					margin-left: 30rpx;
				}	
				.cba-title-text{
					margin-right: 450rpx;
					font-size: 40rpx;
					
				}
				.more{
					display: inline-block;
					position: relative;
					margin-right: 40rpx;
					.icon{
						position: absolute;
						right: -20px;
						
						
					}
				}
			}
			
			.cba-content{
				margin: 30rpx 30rpx;
				
				.cba-itme{
					display: flex;
					justify-content: space-between;
					align-items: center;
					white-space: nowrap;
					width: 700rpx;
					height: 140rpx;
					border-radius: 32.8rpx;
					box-sizing: border-box;
					border: 0.5px solid #999999;
					margin-bottom: 20px;
					
					.cba-logo{
						/* margin-left: 10rpx; */
						.cba-logo-img{
							width:76rpx;
						    height: 80rpx; 
							margin-left:10rpx;
						}		
					}
					.cba-team-score{
						display: flex;
						flex-direction: column;
						/* justify-content: start; */
						align-items: center;
						font-family: Inter-Thin;
						font-size: 14.35px;
						font-weight: 100;
						line-height: 20px;
						letter-spacing: 0px;
						
						.cba-team-name{
							.left{
								margin-right: 50rpx;
								
							}
							.right{
								margin-left:50rpx;
								
							}
						}
					}
					.check{
						color: #fff;
						font-size: 32rpx;
						width: 100rpx;
						height: 140rpx;
						
						background: #9B1010;
						text-align: center;
						line-height: 140rpx;
						border-radius: 0px 16.4px 16.4px 0px;
						&.end{
							color: #a0a0a0;
						}
					}
				}
			}
		}
	}
</style>
